@import '../../styles/var.scss';
@import '../../styles/mixins.scss';

.m-result {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 192px 0;

  &-success {
    .m-result-icon {
      .m-icon {
        color: $color-primary;
      }
    }
  }

  &-waiting {
    .m-result-icon {
      .m-icon {
        color: $color-primary;
      }
    }
  }

  &-title {
    font-size: $font-size-xlarge;
    color: $text-color-main;
    font-weight: 500;
    margin-top: 56px;
  }

  &-desc {
    font-size: $font-size-base;
    color: $text-color-secondary;
    margin-top: 16px;
  }

  &-footer {
    width: 100%;
    margin-top: 112px;

    &-space {
      @include flex-center;
      gap: 32px;

      &-multiple {
        .m-result-footer-btn {
          width: 256px;
        }
      }

      :not(.m-result-footer-space-multiple) {
        .m-result-extra-btn {
          flex: 1;
        }
      }
    }
  }
}
